<%@ page language="java" contentType="text/html; charset=US-ASCII"
    pageEncoding="US-ASCII"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<br>

<h3>Audit</h3>
<link rel="stylesheet" type="text/css" href="js/plugins/dataTables/extensions/TableTools/css/dataTables.tableTools.css">
<script type='text/javascript' src='js/plugins/dataTables/extensions/TableTools/js/dataTables.tableTools.js'></script>
<style type="text/css" class="init">

	div.DTTT { margin-bottom: 0.5em; float: right; }
	div.dataTables_wrapper { clear: both; }

	</style>
<div id="audit-alert-container"></div>
<div class="panel panel-default">
   <div class="panel-heading">
		<i class="fa fa-filter"></i> <a data-toggle="collapse" href="#filterCollapse">Filter</a>
	</div>
	<div id="filterCollapse" class="panel-collapse collapse">
	  <div class="panel-body">
	   	 <form class="form-horizontal" role="form" id="audit-filter-form">
	   	 				<div class="form-group">
	                        <label for="username" class="col-sm-2 control-label">Username:</label>
	                         <div class="col-sm-5">
	                        	 <input id="username" type="text" class="form-control input-sm" placeholder="Filter by Username" />
	                         </div>
	                         <div class="col-sm-5">
		                          <label for="maxResults" class="col-sm-5 control-label" >Max Results:</label>
		                          <div class="col-sm-7">
		                        	 <select id="maxResults" class="form-control input-sm">
		                                  	 <option selected>25</option>
		                                  	 <option>50</option>
		                                  	  <option>100</option>
		                                  	   <option>200</option>
		                                  	    <option>500</option>
		                              </select>
		                           </div>
	                         </div>
	                    </div>
	                    <div class="form-group">
	                        <label for="task" class="col-sm-2 control-label">Task:</label>
	                        
	                        <div class="col-sm-5">
	   	                      	<input id="task" type="text" class="form-control input-sm" placeholder="Filter by Task" />
	                         </div>
	                    </div>
	                    <div class="form-group">
	                        <label for="fromTime" class="col-sm-2 control-label">From:</label>
	                        <div class="col-sm-5">
	                      		  <div  class="input-group"  id="fromTimeDateTimePicker">
	                      		  	<input id="fromTime" type="text" class="form-control input-sm"  placeholder="Filter by Generated Time"/>
	                      		  	<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
	                        	  </div>
	                      	   
	                         </div>
	                    </div>
	                    <div class="form-group">
	                        <label for="toTime" class="col-sm-2 control-label">To:</label>
	                        <div class="col-sm-5">
	                        	<div  class="input-group date" id="toTimeDateTimePicker">
	                      	  		 <input id="toTime" type="text" class="form-control input-sm"  placeholder="Filter by Generated Time"/>
	                      		  	 <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
                 					 </span>
	                      	  	 </div>
	                      	  	 
	                         </div>
	                    </div>
	                     <div class="form-group">
	                     	<div class="col-sm-2">
	                     	</div>
	                     	<div class="col-sm-5">
	                     		<button type="button" id="auditFilterBtn" class="btn pull-right btn-primary">Submit</button>
	                     	</div>
	                     </div>
	                    
	   	 </form>
	  </div>
	 </div>
</div>
<div class="panel panel-default" >
	<div class="panel-heading">
		<i class="fa fa-cog"></i>Audit
		
	</div>
	<div class="panel-body">
		<p>Default results shown below are 25. Please select more from Filter.</p>
		<table class="table table-striped table-bordered table-hover" id="audit-table-list">
		 	<thead>
	         <tr>
	          	<th>id</th>
	             <th>Username</th>
	             <th>Profile</th>
	             <th>Server</th>
	             <th>Gen Time</th>
	             <th>Start Time</th>
	             <th>End Time</th>
	             <th>Task</th>
	             <th>Comments</th>
	         </tr>
   	  		</thead>
		</table>
	</div>
</div>
<script>
	$(document).ready(function() {
		$('#fromTimeDateTimePicker').datetimepicker();
		$('#toTimeDateTimePicker').datetimepicker();
		
		
		var auditList=getAuditList()
		var auditTable;
		if(!jQuery.isEmptyObject(auditList)){	
			initializeTable(auditList)
    		
		}
		function getAuditList(){
			var filterObj={username:"", task:"", fromTime:"", toTime:"" }
			dwr.util.getValues(filterObj);
			var aList=uft.getAllAuditList(parseInt($( "#maxResults option:selected" ).text()) ,filterObj );
			return aList;
		}
		
		function initializeTable(auditL){
				auditTable= $('#audit-table-list').dataTable( {
				data: auditL,
				order: [[ 4, 'desc' ]],
		        columns: [
			        	{ data: "id" ,"visible": false,},
			            { data: "username" },
			            { data: "profileId" ,render: function ( data, type, row ) {
			            	 	return "<a onClick='uft.showProfilePopover(this, \""+data+"\")' data-content=\"\" data-original-title=\"\"><i class='fa fa-empire'></i></a>"
			            	}},
			            { data: "serverId",render: function ( data, type, row ) {
			            		return "<a onClick='uft.showServerPopover(this, \""+data+"\")' data-content=\"\" data-original-title=\"\"><i class='fa fa-hdd-o'></i></a>"
			            	}},
			            { data: "gentime",render: function ( data, type, row ) {
			            		if(data != null){
			               		 	return uft.getDataFormat(data, "MM/DD/YY hh:mm A")
			                	}else{
			                		return "";
			                	}
			            	} },
			            { data: "startTime" ,render: function ( data, type, row ) {
			            		if(data != null){
			               		 	return uft.getDataFormat(data, "MM/DD/YY hh:mm A")
			                	}else{
			                		return "";
			                	}
			            	}},
			            { data: "endTime" ,render: function ( data, type, row ) {
			            		if(data != null){
			               		 	return uft.getDataFormat(data, "MM/DD/YY hh:mm A")
			                	}else{
			                		return "";
			                	}
			            	}},
			            { data: "task" },
			            { data: "comments" }
		           
		       		 ]
		    	});
		    	var tt = new $.fn.dataTable.TableTools( auditTable , {
				  sSwfPath: "js/plugins/dataTables/extensions/TableTools/swf/copy_csv_xls_pdf.swf"
				} );
		    	$( tt.fnContainer() ).insertBefore('div.dataTables_wrapper');
	    	
		}
		
		
		$("#auditFilterBtn").click(function(){	
			var auditList= getAuditList();
			if(!jQuery.isEmptyObject(auditList)){	
				if( typeof auditTable != undefined){
					auditTable.fnClearTable();	
					auditTable.fnAddData(auditList);
					auditTable.fnDraw();
				}else {
					initializeTable(auditList)
				}
				
				
    			
    		 }
	 		 
		})
	})
</script>